<script type="text/javascript" src="{$smarty.const.TEMPLATE_DIR}test/test.js"></script>


<div style="float: left; width: 200px; height: 1024px; background-color: #add8e6;">
</div>
<div id="target" style=" float: left; width: 800px; height: 1024px; background-color: #adff2f; position: relative;">
    <div id="thrash" style="display: none; position: absolute; width: 20px; height: 1024px; background-color: #ffa07a;;">
    </div>
</div>


{literal}
<script type="text/javascript">
    var options = {
        table: {
            size: 60,
            radius: 40,
            top: 100,
            left: 200
        },
        seat: {
            count: 8,
            offset: 50,
            onClick: function (seat, instance){
                if(!seat.TestColor){
                    seat.css("background-color", "yellow");
                    seat.TestColor = true;
                } else {
                    seat.css("background-color", "blue");
                    seat.TestColor = false;
                }
            }
        },
        manager: {
            ShowTrash: function(){
                $("#thrash").show();
            },
            HideTrash: function(){
                $("#thrash").hide();
            }
        }
    };
    var table = new RoundTable(options);
    table.appendTo("#target");
</script>
{/literal}
